<template>
    <el-dialog
            title="选择审批人"
            :visible.sync="dialogVisible"
            append-to-body
            width="450px">
        <div class="dialog-main">

            <el-scrollbar style="height: 380px" v-loading="loading">
                <div v-for="item in taskList" :key="item.nodeId">
                    <el-divider content-position="left"> <el-radio v-model="activityId" :label="item.nodeId"  v-if="type==='reject'"><i></i></el-radio>
                        {{ item.name }}</el-divider>
                    <el-table
                            size="mini"
                            :data="item.userList"
                            border
                            max-height="250"
                            style="width: 100%">
                        <el-table-column
                                prop=""
                                width="50"
                                label="">
                            <template slot-scope="{row}">
                                <el-radio :disabled="item.setType===1" @change="radioChange(item.nodeId, row )" :label="true" :value="radioCheck(item.nodeId,row)"><i></i></el-radio>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="nickName"
                                label="姓名">
                        </el-table-column>
                        <el-table-column
                                prop="deptName"
                                label="部门">
                        </el-table-column>
                    </el-table>
                </div>

            </el-scrollbar>
        </div>
        <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false" size="small">取 消</el-button>
      <el-button type="primary" size="small" @click="confirm">确 定</el-button>
    </span>
    </el-dialog>
</template>

<script>
    import {nextTaskNode,getStartTaskNodeVoByProcessDefinitionId,getStartTaskNodeVoByProcessDefinitionKey,getBackNodesByProcessInstanceId} from '@/api/Task'

    export default {
        inject: ['getTaskId'],
        props:{

        },
        data() {
            return {
                dialogVisible:false,
                loading:false,
                form: {
                    message: '',
                    nextNodeId: '123',
                },
                selectUser:{

                },
                activityId:'',
                type:'',
                taskList:[
                ],
                commonWords:[
                    '同意',
                    '情况紧急，请尽快处理！'
                ]
            }
        },
        computed:{
            radioCheck(){
                return function (nodeId,row) {
                    return  this.selectUser[nodeId]&&this.selectUser[nodeId].indexOf(row.userId) !=-1
                }
            },
        },
        methods: {
            open(type,val,variables) {
                this.getTaskList(type,val,variables)
                this.dialogVisible = true
            },
            radioChange(nodeId,row){
                this.selectUser[nodeId] = [row.userId]
            },
            confirm(){
                for(const key in this.selectUser){
                    if(!this.selectUser[key].length){
                        this.$message.warning('请选择审批人')
                        return
                    }
                }
                this.dialogVisible = false
                this.$emit('confirm',this.selectUser,this.activityId)
            },
            getTaskList(type,val,variables){
                this.taskList = []
                this.loading = true
                this.type = type
                let fun
                switch (type) {
                    case 'task':
                        fun = nextTaskNode(val)
                        break
                    case 'reject':
                        fun = getBackNodesByProcessInstanceId(val)
                        break
                    case 'processDefinitionId':
                        fun = getStartTaskNodeVoByProcessDefinitionId(val)
                        break
                    case 'processDefinitionKey':
                        fun = getStartTaskNodeVoByProcessDefinitionKey(val)
                        break
                }
                fun.then(res=>{
                    this.taskList = res.data||[]
                    this.taskList.forEach(x=>{
                        this.$set( this.selectUser,x.nodeId,[])
                        if(x.userList.length){
                            this.$set( this.selectUser,x.nodeId,[x.userList[0].userId])

                        }
                    })
                    if(this.taskList.length){
                        this.activityId = this.taskList[0].nodeId
                    }
                }).finally(()=>{
                    this.loading = false
                })
            },
        },
        created() {
        }
    }
</script>

<style scoped lang="scss">
    .dialog-main{
        .el-divider{
            .el-divider__text{
                font-size: 18px;
            }

        }

    }

</style>
